import React, { useEffect, useState } from 'react';
import { Input, Select, Button, Table, Radio, message } from 'antd';
import styles from './index.less';
import dayjs from 'dayjs';
import { history, KeepAlive } from 'umi';
import { DeleteOutlined } from '@ant-design/icons';
import './index.less';
import {
  getProduct,
  getVersion,
  getGameName,
  getReport,
  saveReport,
  exportReport,
  getReportInfoByID,
} from '@/api/game_report_controller';
import { forEach } from 'lodash';
import { setTextRange } from 'typescript';
const { Option } = Select;
const { Search } = Input;
const { TextArea } = Input;
const CompareReportManager = (props) => {
  // 测试方法
  let selectData = [];
  // 手机型号
  // let brandData = [];
  // let boardData = [];
  // 手机版本
  let versionData = [];
  // 基线卡片列表
  const testTeamList = [
    {
      value: '软工性能组',
      label: '软工性能组',
    },
    {
      value: 'PDU一部',
      label: 'PDU一部',
    },
    {
      value: 'PDU二部',
      label: 'PDU二部',
    },
  ];
  const testObjectList = [
    {
      value: '230523小米竞品数据刷新',
      label: '230523小米竞品数据刷新',
    },
    {
      value: 'ALT-A竞品数据',
      label: 'ALT-A竞品数据',
    },
    {
      value: '展开英雄联盟',
      label: '展开英雄联盟',
    },
  ];
  // 存储测试团队选中的值
  const [testTeamValue, setTestTeam] = useState('');
  // 测试方法选中的值
  const [testMethodValue, setTestMethod] = useState('');
  // 手机版本选中的值
  const [testVersionValue, setTestVersion] = useState('');
  // 对比版本选中值
  const [compareValue, setCompare] = useState('');
  // 对比基线选中值
  const [baseLineValue, setBaseLine] = useState('');
  // 报告名称选种植
  const [reportNameValue, setReportName] = useState('');
  // 软件版本选种植
  const [softVersionValue, setSoftVertion] = useState('');
  // 硬件版本选种植
  const [hardWareVerdionValue, setHardWareVerdion] = useState('');
  // 版本阶段选种植
  const [versionStateValue, setVersionState] = useState('');
  // 版本目的选种植
  const [versionGoalValue, setVersionGoal] = useState('');
  // 测试范围选种植
  const [testRangeValue, setTestRange] = useState('');
  // 测试周期选种植
  const [testCycleValue, setTestCycle] = useState('');
  // 版本质量要求选种植
  const [versionQualityReq, setVersionQualityReq] = useState('');
  // 手机版本质量选种植
  const [actualVersionQuality, setActualVersionQuality] = useState('');
  // 游戏常态信息
  const [gameGeneralInfos, setGameGeneralInfos] = useState([]);
  // 手机型号列表
  const [brandList, setBrandList] = useState([]);
  // 手机版本列表
  const [versionList, setVersionList] = useState([]);
  // 新增问题
  const columns = [
    {
      title: '状况',
      dataIndex: 'stats',
      key: 'stats',
      render: (_, record, index) => (
        <Select
          style={{ width: '100%' }}
          options={[
            { value: 'Fail', label: 'Fail' },
            { value: 'Success', label: 'Success' },
          ]}
          onChange={(e) => handleStatsChange(e, record)}
        ></Select>
      ),
    },
    {
      title: '问题描述',
      dataIndex: 'description',
      key: 'description',
      render: (_, record, index) => (
        <TextArea
          // value={tableData[index].name}
          placeholder="请输入内容"
          onChange={(e) => handleDescriptionChange(e, record)}
        ></TextArea>
      ),
    },
    {
      title: '问题初步分析',
      dataIndex: 'analysis',
      key: 'analysis',
      render: (_, record, index) => (
        <TextArea
          // value={tableData[index].problem}
          placeholder="请输入内容"
          onChange={(e) => handleAnalysisChange(e, record)}
        ></TextArea>
      ),
    },
    {
      title: '责任人',
      dataIndex: 'responsiblePerson',
      key: 'responsiblePerson',
      render: (_, record, index) => (
        <Input
          placeholder="请输入内容"
          onChange={(e) => handleResponsiblePerson(e, record)}
        ></Input>
      ),
    },
    {
      title: '单号',
      dataIndex: 'dts',
      key: 'dts',
      render: (_, record, index) => (
        <Input
          placeholder="请输入内容"
          onChange={(e) => handleDts(e, record)}
        ></Input>
      ),
    },
    {
      title: '严重级别',
      dataIndex: 'severityLevel',
      key: 'severityLevel',
      render: (_, record, index) => (
        <Select
          placeholder="请选择"
          style={{ width: '100%' }}
          onChange={(e) => handleSeverityLevel(e, record)}
        ></Select>
      ),
    },
    {
      title: 'Log与systrace归档路径',
      dataIndex: 'archivePath',
      key: 'archivePath',
      render: (_, record, index) => (
        <TextArea
          placeholder="请输入内容"
          onChange={(e) => handleArchivePath(e, record)}
        ></TextArea>
      ),
    },
    {
      title: '操作',
      dataIndex: 'handle',
      key: 'handle',
      render: (_, record, index) => (
        <a
          onClick={() => {
            deleteProblem(record, index);
          }}
        >
          删除
        </a>
      ),
    },
  ];
  const [tableData, settableData] = useState([]);
  // 详细数据
  const columnsDetail = [
    {
      title: '操作',
      dataIndex: 'action',
      key: 'action',
      render: () => <a>删除</a>,
      width: 100,
    },
    {
      title: '基础信息',
      dataIndex: 'baseInfo',
      key: 'baseInfo',
      children: [
        {
          title: '测试手机',
          dataIndex: 'phone',
          key: 'phone',
          width: 100,
        },
        {
          title: '测试版本',
          dataIndex: 'testVersion',
          key: 'testVersion',
          width: 100,
          onCell: (record, rowIndex) => {
            // 传入两个形参，分别为该行对应的内容r与行索引
            if (record.key === 2) {
              // 可根据参数内容进行判断，如果是偶数行，就将背景颜色设置蓝红色
              return {
                style: {
                  fontWeight: 'bold',
                },
              };
            }
          },
        },
        {
          title: '测试游戏',
          dataIndex: 'testGame',
          key: 'testGame',
          width: 100,
        },
        {
          title: '游戏版本',
          dataIndex: 'gameVersion',
          key: 'gameVersion',
          width: 100,
        },
        {
          title: '满帧',
          dataIndex: 'fullFrame',
          key: 'fullFrame',
          width: 100,
        },
      ],
    },
    {
      title: '关键数据',
      dataIndex: 'keyData',
      key: 'keyData',
      children: [
        {
          title: '平均帧率',
          dataIndex: 'averageFrame',
          key: 'averageFrame',
          width: 100,
        },
        {
          title: '低帧率',
          dataIndex: 'lowFrame',
          key: 'lowFrame',
          width: 100,
        },
        {
          title: '抖动率',
          dataIndex: 'jitterRate',
          key: 'jitterRate',
          width: 100,
        },
        {
          title: '每小时卡顿次数',
          dataIndex: 'numberHour',
          key: 'numberHour',
          width: 100,
        },
        {
          title: '最差丢帧',
          dataIndex: 'lostFrame',
          key: 'lostFrame',
          width: 100,
        },
        {
          title: '归一化电流',
          dataIndex: 'normalizedCurrent',
          key: 'normalizedCurrent',
          width: 100,
        },
        {
          title: '分辨率',
          dataIndex: 'resolutionRatio',
          key: 'resolutionRatio',
          width: 100,
        },
        {
          title: '游戏版本',
          dataIndex: 'gameVersion',
          key: 'gameVersion',
          width: 100,
        },
      ],
    },
    {
      title: '辅助数据',
      dataIndex: 'auxiliaryata',
      key: 'auxiliaryata',
      children: [
        {
          title: '链接',
          dataIndex: 'link',
          key: 'link',
          render: () => <a>报告详情</a>,
          width: 100,
        },
        {
          title: '环境温度',
          dataIndex: 'ambientTemperature',
          key: 'ambientTemperature',
          width: 100,
        },
        {
          title: 'shell最低温度',
          dataIndex: 'shellLow',
          key: 'shellLow',
          width: 100,
        },
        {
          title: 'shell最高温度',
          dataIndex: 'shellHigh',
          key: 'shellHigh',
          width: 100,
        },
        {
          title: 'system_h最低温度',
          dataIndex: 'systemLow',
          key: 'systemLow',
          width: 100,
        },
        {
          title: 'system_h最高温度',
          dataIndex: 'systemHigh',
          key: 'systemHigh',
          width: 100,
        },
        {
          title: '壳温升温',
          dataIndex: 'shellRise',
          key: 'shellRise',
          width: 100,
        },
        {
          title: '前10分钟温长',
          dataIndex: 'durationTen',
          key: 'durationTen',
          width: 100,
        },
        {
          title: '低温时长占比',
          dataIndex: 'durationLow',
          key: 'durationLow',
          width: 100,
        },
        {
          title: '最小帧',
          dataIndex: 'minFrame',
          key: 'minFrame',
          width: 100,
        },
        {
          title: '测试方式',
          dataIndex: 'testType',
          key: 'testType',
          width: 100,
        },
        {
          title: '测试人员',
          dataIndex: 'testers',
          key: 'testers',
          width: 100,
        },
        {
          title: '测试时间',
          dataIndex: 'testTime',
          key: 'testTime',
          width: 100,
        },
        {
          title: '游戏时长(分钟)',
          dataIndex: 'gameTime',
          key: 'gameTime',
          width: 100,
        },
        {
          title: 'CPU-C1(频率)',
          dataIndex: 'CPU-C1',
          key: 'CPU-C1',
          width: 100,
        },
        {
          title: 'CPU-C2(频率)',
          dataIndex: 'CPU-C2',
          key: 'CPU-C2',
          width: 100,
        },
        {
          title: 'CPU-C3(频率)',
          dataIndex: 'CPU-C3',
          key: 'CPU-C3',
          width: 100,
        },
        {
          title: 'GPU(频率)',
          dataIndex: 'GPU',
          key: 'GPU',
          width: 100,
        },
        {
          title: 'DDR(频率)',
          dataIndex: 'DDR',
          key: 'DDR',
          width: 100,
        },
        {
          title: '备注',
          dataIndex: 'note',
          key: 'note',
          width: 100,
        },
      ],
    },
  ];
  const [detailData, setDetailData] = useState([
    // {
    //   key: 1,
    //   phone: 'info1',
    //   testVersion: '1',
    //   isBold: true,
    // },
    // {
    //   key: 2,
    //   phone: 'info2',
    //   testVersion: '2',
    //   isBold: false,
    // },
  ]);
  const addProblem = (e) => {
    console.log('-----------(新增问题按钮)', tableData);
    tableData.push({
      key: tableData.length + 1,
    });
    settableData([...tableData]);
  };
  const deleteProblem = (record, index) => {
    console.log('record', record);
    // settableData(tableData.filter(a => a.key !== record.key));
    const newData = tableData.filter((item) => item.key !== record.key);
    settableData(newData);
  };
  const handleStatsChange = (e, record) => {
    // 状况变化
    // const { value } = e.target;
    const newData = [...tableData];
    const index = newData.findIndex((item) => record.key === item.key);
    if (index > -1) {
      newData[index].stats = e;
      settableData(newData);
    }
  };
  const handleDescriptionChange = (e, record) => {
    // 问题描述
    const newData = [...tableData];
    const index = newData.findIndex((item) => record.key === item.key);
    if (index > -1) {
      newData[index].description = e.target.value;
      settableData(newData);
    }
  };
  const handleAnalysisChange = (e, record) => {
    // 问题初步分析
    const newData = [...tableData];
    const index = newData.findIndex((item) => record.key === item.key);
    if (index > -1) {
      newData[index].analysis = e.target.value;
      settableData(newData);
    }
  };
  const handleResponsiblePerson = (e, record) => {
    // 责任人
    const newData = [...tableData];
    const index = newData.findIndex((item) => record.key === item.key);
    if (index > -1) {
      newData[index].responsiblePerson = e.target.value;
      settableData(newData);
    }
  };
  const handleDts = (e, record) => {
    // 单号
    const newData = [...tableData];
    const index = newData.findIndex((item) => record.key === item.key);
    if (index > -1) {
      newData[index].dts = e.target.value;
      settableData(newData);
    }
  };
  const handleSeverityLevel = (e, record) => {
    // 严重级别
    const { value } = e.target;
    const newData = [...tableData];
    const index = newData.findIndex((item) => record.key === item.key);
    if (index > -1) {
      newData[index].severityLevel = value;
      settableData(newData);
    }
  };
  const handleArchivePath = (e, record) => {
    // 归档路径
    const newData = [...tableData];
    const index = newData.findIndex((item) => record.key === item.key);
    if (index > -1) {
      newData[index].archivePath = e.target.value;
      settableData(newData);
    }
  };
  const queryReportBtn = async () => {
    const par = {
      baseline: baseLineValue,
      projectId: '614',
      compareUpVersion: compareValue,
      testTeam: testTeamValue,
      testMethod: testMethodValue,
      versions: testVersionValue[0],
      gameName: '王者荣耀',
    };
    const { data } =
      testMethodValue.length > 0
        ? await getReport(par)
        : message.warning('请选择手机版本');
    // 表单回显
    if (data) {
      setSoftVertion(data.data.softVersion); // 软件
      setTestCycle(data.data.testCycle); // 周期
      setTestRange(data.data.testRange); // 范围
      setHardWareVerdion(data.data.hardwareVersion); // 硬件
      setGameGeneralInfos(data.data.gameGeneralInfos); //  游戏常态信息
    }
  };
  const saveReportBtn = async () => {
    const par = {
      // 报告ID，新增保存报告时置空
      reportId: '',
      projectId: '614',
      reportName: reportNameValue,
      softVersion: softVersionValue,
      hardwareVersion: hardWareVerdionValue,
      versionStage: versionStateValue,
      versionGoal: versionGoalValue,
      testRange: testRangeValue,
      testCycle: testCycleValue,
      reportCondition: {
        // 对比基线
        baseline: String(baseLineValue),
        // 对比版本
        compareUpVersion: String(compareValue),
        // 测试团队
        testTeam: testTeamValue,
        // 测试方法
        testMethod: testMethodValue,
        // 手机版本
        versions: testVersionValue[0],
        // 游戏名称
        gameName: '王者荣耀',
      },
      versionQualityReq: versionQualityReq,
      actualVersionQuality: actualVersionQuality,
      newQuestions: tableData,
    };
    console.log('-----------(保存报告时携带的参数)', par);
    const resp = await saveReport(par);
    console.log('-----------(保存报告返回值)', resp);
  };
  const exportBtn = async () => {
    const par = {
      // 报告ID，新增保存报告时置空
      reportId: '',
      projectId: '614',
      reportName: reportNameValue,
      softVersion: softVersionValue,
      hardwareVersion: hardWareVerdionValue,
      versionStage: versionStateValue,
      versionGoal: versionGoalValue,
      testRange: testRangeValue,
      testCycle: testCycleValue,
      reportCondition: {
        // 对比基线
        baseline: String(baseLineValue),
        // 对比版本
        compareUpVersion: String(compareValue),
        // 测试团队
        testTeam: testTeamValue,
        // 测试方法
        testMethod: testMethodValue,
        // 手机版本
        versions: testVersionValue[0],
        // 游戏名称
        gameName: '王者荣耀',
      },
      versionQualityReq: versionQualityReq,
      actualVersionQuality: actualVersionQuality,
      newQuestions: tableData,
      gameGeneralInfos: gameGeneralInfos,
    };
    const resp = await exportReport({ par });
    console.log('-----------(resp)', resp.data);
    const blob = new Blob([resp.data]); // 把得到的结果用流对象转一下
    var a = document.createElement('a'); // 创建一个<a></a>标签
    a.href = URL.createObjectURL(blob); // 将流文件写入a标签的href属性值
    a.download = '测试导出报告.xlsx'; // 设置文件名
    a.style.display = 'none'; // 障眼法藏起来a标签
    document.body.appendChild(a); // 将a标签追加到文档对象中
    a.click(); // 模拟点击了a标签，会触发a标签的href的读取，浏览器就会自动下载了
    a.remove(); // 一次性的，用完就删除a标签
  };
  return (
    <div className={styles.reportContainer}>
      <div className={styles.messageCard}>
        <div className={styles.title}>
          <div className={styles.title_black}></div>
          条件筛选
        </div>
        <div className={styles.smallTable}>
          <div className={styles.tableColumn}>
            <div className={styles.column_label}>
              <label className={styles.column_title}>测试团队</label>
              <Select
                allowClear
                className={styles.select_type}
                options={testTeamList}
                onChange={(val) => {
                  // console.log(val);
                  setTestTeam(val);
                }}
              />
            </div>
            <div className={styles.column_label}>
              <label className={styles.column_title}>测试方法</label>
              <Select
                allowClear
                className={styles.select_type}
                options={testObjectList}
                onChange={async (val) => {
                  setTestMethod(val);
                  // console.log(val);
                  // 获取当前用户测试的产品
                  const resp = await getProduct({
                    testTeam: testTeamValue,
                    projectId: '614',
                    testMethod: val,
                  });
                  resp.data.data.map((item) => {
                    selectData.push({
                      label: item.brand,
                      value: item.board,
                    });
                  });
                  setBrandList(selectData);
                  // console.log('-----------(获取测试产品的返回值)', resp);
                }}
              />
            </div>
            <div className={styles.radio}>
              <label className={styles.column_title}>对比基线</label>
              <Radio.Group
                onChange={(e) => {
                  // console.log('-----------(对比基线选种植)', e);
                  setBaseLine(e.target.value);
                }}
                value={baseLineValue}
              >
                <Radio value={1}>S标</Radio>
                <Radio value={2}>A标</Radio>
              </Radio.Group>
              <label className={styles.column_title}>默认</label>
              <Select
                allowClear
                className={styles.select_type}
                options={[
                  { value: '1', label: '1' },
                  { value: '2', label: '2' },
                ]}
              />
            </div>
          </div>
          <div className={styles.tableColumnNext}>
            <div className={styles.column_label}>
              <label className={styles.column_title}>手机型号</label>
              <Select
                mode="multiple"
                allowClear
                className={styles.select}
                options={brandList}
                labelInValue={true}
                onChange={async (val) => {
                  // console.log("-----------(获取手机型号的详细信息)", val);
                  // val.forEach((item) => {
                  //   brandData.push(item.label)
                  //   boardData.push(item.value)
                  // })
                  const resp = await getVersion({
                    testTeam: testTeamValue,
                    projectId: '614',
                    testMethod: testMethodValue,
                    brands: val[0].label,
                    boards: val[0].value,
                  });
                  resp.data.data.forEach((item) => {
                    versionData.push({
                      label: item,
                      value: item,
                    });
                  });
                  setVersionList(versionData);
                  // console.log('-----------(获取手机版本)', versionData);
                }}
              />
            </div>
            <div className={styles.column_label}>
              <label className={styles.column_title}>手机版本</label>
              <Select
                mode="multiple"
                allowClear
                className={styles.select}
                options={versionList}
                onChange={async (val) => {
                  setTestVersion(val);
                  const resp = await getGameName({
                    testTeam: testTeamValue,
                    projectId: '614',
                    testMethod: testMethodValue,
                    versions: testVersionValue,
                  });
                  // console.log('-----------(获取游戏名称)', resp);
                }}
              />
            </div>
            <div className={styles.column_label1}>
              <label className={styles.column_title}>游戏名称</label>
              <Select
                mode="multiple"
                allowClear
                className={styles.select}
                options={[
                  { value: '原神', label: '原神' },
                  { value: '王者荣耀', label: '王者荣耀' },
                  { value: 'QQ飞车', label: 'QQ飞车' },
                  { value: '和平精英', label: '和平精英' },
                ]}
              />
            </div>
            <div className={styles.column_label2}>
              <label className={styles.column_title}>与上一个版本对比</label>
              <Radio.Group
                onChange={(e) => {
                  // console.log('-----------(版本对比选种植)', e);
                  setCompare(e.target.value);
                }}
                value={compareValue}
              >
                <Radio value={1}>是</Radio>
                <Radio value={2}>否</Radio>
              </Radio.Group>
            </div>
          </div>
          <div className={styles.query_div}>
            <Button
              className={styles.query_bt}
              type="primary"
              onClick={queryReportBtn}
            >
              查询
            </Button>
          </div>
        </div>
        <div className={styles.title}>
          <div className={styles.title_black}></div>
          基本信息
        </div>
        <div className={styles.baseTable}>
          <div className={styles.tableColumn}>
            <div className={styles.column_label}>
              <label className={styles.column_title}>报告名称</label>
              <Input
                allowClear
                placeholder="请输入报告名称"
                className={styles.input_info}
                onChange={(val) => {
                  setReportName(val.nativeEvent.target.value);
                }}
              />
            </div>
          </div>
          <div className={styles.tableColumnNext}>
            <div className={styles.column_label}>
              <label className={styles.column_title}>软件版本</label>
              <Input
                allowClear
                placeholder="请输入软件版本"
                className={styles.input_info}
                value={softVersionValue}
                onChange={(val) => {
                  setSoftVertion(val.nativeEvent.target.value);
                }}
              />
            </div>
            <div className={styles.column_label}>
              <label className={styles.column_title}>硬件版本</label>
              <Input
                allowClear
                placeholder="请输入硬件版本"
                className={styles.input_info}
                value={hardWareVerdionValue}
                onChange={(val) => {
                  setHardWareVerdion(val.nativeEvent.target.value);
                }}
              />
            </div>

            <div className={styles.column_label}>
              <label className={styles.column_title}>版本阶段</label>
              <Input
                allowClear
                placeholder="请输入版本阶段"
                className={styles.input_info}
                onChange={(val) => {
                  setVersionState(val.nativeEvent.target.value);
                }}
              />
            </div>
          </div>
          <div
            className={styles.tableColumnNext}
            style={{ marginBottom: '42px' }}
          >
            <div className={styles.column_label}>
              <label className={styles.column_title}>版本目的</label>
              <Input
                allowClear
                placeholder="请输入版本目的"
                className={styles.input_info}
                onChange={(val) => {
                  setVersionGoal(val.nativeEvent.target.value);
                }}
              />
            </div>
            <div className={styles.column_label}>
              <label className={styles.column_title}>测试范围</label>
              <Input
                allowClear
                placeholder="请输入测试范围"
                className={styles.input_info}
                value={testRangeValue}
                onChange={(val) => {
                  setTestRange(val.nativeEvent.target.value);
                }}
              />
            </div>
            <div className={styles.column_label}>
              <label className={styles.column_title}>请输入测试周期</label>
              <Input
                allowClear
                placeholder="请输入测试周期"
                className={styles.input_info}
                value={testCycleValue}
                onChange={(val) => {
                  setTestCycle(val.nativeEvent.target.value);
                }}
              />
            </div>
          </div>
        </div>

        <div className={styles.title}>
          <div className={styles.title_black}></div>
          质量状况
        </div>
        <div className={styles.resultTable}>
          <div className={styles.tableColumn}>
            <div className={styles.column_label}>
              <label className={styles.column_title}>版本质量要求</label>
              <Select
                allowClear
                className={styles.select_type}
                defaultValue={'80%游戏达标'}
                options={[
                  { value: '80%游戏达标', label: '80%游戏达标' },
                  { value: '100%游戏达标', label: '100%游戏达标' },
                ]}
                onChange={(val) => {
                  setVersionQualityReq(val);
                }}
              />
            </div>
            <div className={styles.column_label}>
              <label className={styles.column_title}>实际版本质量</label>
              <Input
                allowClear
                placeholder="请输入实际版本质量"
                className={styles.select_type}
                onChange={(val) => {
                  console.log(
                    '-----------(实际版本质量)',
                    val.nativeEvent.target.value,
                  );
                  setActualVersionQuality(val.nativeEvent.target.value);
                }}
              />
            </div>
          </div>
          <div className={styles.newly}>
            <span className={styles.table_title}>新增问题</span>
            <Button
              className={styles.btn_add}
              onClick={addProblem}
              type="primary"
            >
              新增
            </Button>
          </div>
          <Table
            columns={columns}
            dataSource={tableData}
            pagination={false}
            className={styles.table_style}
          ></Table>
        </div>

        <div className={styles.title}>
          <div className={styles.title_black}></div>
          详细数据
        </div>

        <div className={styles.detailTable}>
          <Table
            className={styles.table_top}
            pagination={false}
            columns={columnsDetail}
            dataSource={detailData}
            scroll={{
              x: 'calc(700px + 50%)',
              y: 240,
            }}
            rowClassName={(record, index) => {
              if (index % 2 === 0) {
                console.log('record11111', record);
                return styles.warning;
              } else if (record.isBold) {
                return styles.bold_row;
              } else {
                return '';
              }
            }}
            // onCell={(record, index) => {
            //   console.log('record2222', record);
            //   if (record.key == '2') {
            //     console.log('record2222', record);
            //     return 'table_bg_bold';
            //   } else {
            //     return '';
            //   }
            // }}
          ></Table>
        </div>
        <div className={styles.footer}>
          <Button
            type="primary"
            className={styles.bt_style}
            onClick={saveReportBtn}
          >
            保存报告
          </Button>
          <Button
            className={styles.exportBtn}
            type="primary"
            onClick={exportBtn}
          >
            导出报告
          </Button>
        </div>
      </div>
    </div>
  );
};

export default CompareReportManager;
